<template>
  <div class="index-wrap">
    <frameTop />
    <div :class="isShowTop ? '' : 'padtop60 isShowtopflg'" class="layout">
      <div class="frameCenter">
        <router-view />
      </div>
      <CesiumView v-if="SceneMode == true" ref="cv" />
      <!-- <CesiumView v-else ref="cv" /> -->
      <!-- <CesiumView  ref="cv" /> -->
      <Web-Rtc-Player v-else ref="ue" />
    </div>

  </div>
</template>
<script>
import frameTop from '@/views/main/frameTop.vue'
// import Leaflet from '@/map/leaflet/Leaflet'
import CesiumView from '@/map/cesium/CesiumView'
import WebRtcPlayer from '@/ueRtc/WebRtcPlayer'
import { getRequest } from '@/PixelStreaming/webRtcPlayer';
import { getCookie, setCookie } from '@/PixelStreaming/webRtcPlayer.js'

export default {
  name: 'IndexVue',
  components: {
    frameTop,
    // Leaflet,
    CesiumView,
    WebRtcPlayer
  },
  data() {
    return {
      Breadcrumb: '',
      routeMatched: [],
      isShowTop: true,

    }
  },
  computed: {
    SceneMode() {
      return this.$store.getters.SceneMode
    }
  },
  watch: {
    $route: {
      handler: function (val, from) {
        this.routeMatched = val.matched;
        var _this = this;
        console.log(val.path);
        if (val.path === '/Rehearsal' || val.path === '/reserveplan/visualization') {
          var serverUrl = process.env.VUE_APP_UE;
          getRequest(serverUrl + "/CanCreate").then(function (res) {
            var res = JSON.parse(res);
            console.log(res);
            if (res.success == true) {
              _this.$store.commit('SCENEMODE', false);
            } else {
              _this.$store.commit('SCENEMODE', true);
            }
          }).catch(function (err) {
            _this.$store.commit('SCENEMODE', true);
          })
        } else {
          _this.$store.commit('SCENEMODE', true);
        }
      },
      immediate: true

    }

  },
  created() {
    this.isShowTop = this.$store.getters.pageType ? false : true;
  },
  mounted() {
    this.routeMatched = this.$route.matched
  },
  methods: {
    goHome() {
      if (this.$route.path.indexOf('/safeGeneral') !== -1) return
      this.$router.push({ path: '/safeGeneral' })
    },
  }
}
</script>

<style lang="scss" scoped>
.index-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;

  .layout {
    width: 100%;
    height: 100%;
    position: relative;
    padding-top: 90px;

    .title {
      height: 32px;
      font-size: 16px;
      background: linear-gradient(180deg,
          RGBA(0, 1, 2, 0.5) 0%,
          rgba(1, 30, 59, 0.6) 100%);
      padding: 0 16px;

      .Breadcrumb-head {
        cursor: pointer;

        span {
          letter-spacing: 6px;
          margin-left: 10px;
        }
      }

      .BreadcrumbContent,
      .time {
        color: #b7b7b7;
      }
    }

    .frameCenter {
      width: 100%;
      height: 100%;
      // height: calc(100% - 33px);
      padding: 0 10px 5px;
      overflow: hidden;
    }
  }

  .padtop60 {
    //padding-top: 30px;
    padding-top: 60px;
  }
}
</style>
